<!DOCTYPE html>
<html lang="en" xmlns:th="https://www.thymeleaf.org">
<head>
    <div th:replace="common/common::html"></div>
    <meta charset="UTF-8">
    <title th:text="#{login.title}">Title</title>
</head>
<body style="display: flex;flex-direction: column;width: 100%;height: 100%">
    <div style="flex-basis: 100px;display:flex;flex-direction: row">
        <div style="flex-grow: 1">
            <img th:if="${session.siteLanguage} eq 'en'" th:src="@{/assets/images/logo_en.png}">
            <img th:if="${session.siteLanguage} ne 'en'" th:src="@{/assets/images/logo_zh.png}">
        </div>
        <div style="flex-basis: 100px;margin-top: 10px">
            <a th:href="@{/login/login(siteLanguage=zh)}" target="_self" th:text="#{login.language.zh}">中文</a>
            <a th:href="@{/login/login(siteLanguage=en)}" target="_self" th:text="#{login.language.en}">英文</a>
        </div>
    </div>


    <div style="flex-grow: 1;display:flex;flex-direction: row">
        <div style="flex-grow: 1">
            <img th:src="@{/assets/images/pic.png}"/>
        </div>
        <div style="flex-basis: 300px">
            <form th:action="@{/login/verification}" method="post">
                <div style="margin-top: 10px;justify-content: center">
                    <input style="width: 90%" th:placeholder="#{login.user.name.tip}" name="username">
                    <i class="glyphicon glyphicon-user"></i>
                </div>
                <div style="margin-top: 10px;justify-content: center">
                    <input style="width: 90%" type="password" th:placeholder="#{login.user.password.tip}" name="password">
                    <i class="glyphicon glyphicon-lock"></i>
                </div>
                <div style="margin-top: 10px;justify-content: center">
                    <button style="width: 90%" th:text="#{login.submit}">登录</button>
                </div>
            </form>
        </div>

    </div>
</body>
</html>